<template>
  <nav class="c-nav">
    <ul>
      <li>
        <router-link to="/equipment/1024">1024</router-link>
      </li>
      <li>
        <router-link to="/equipment/430">430</router-link>
      </li>
      <li>
        <router-link to="/equipment/t300">T300</router-link>
      <li>
        <router-link to="/equipment/other">其他设备</router-link>
      </li>
    </ul>
  </nav>
</template>

<script>
export default {
  name: "cNav"
}
</script>

<style scoped lang="less">
  @color: #1890ff;

  .c-nav {
    background-color: #fff;
    padding-left: 24px;

    ul {
      height: 100%;
      display: flex;
      align-items: center;
      justify-content: flex-start;

      li {
        height: 100%;
        line-height: 39px;
        margin-right: 17px;

        a {
          display: block;
          height: 100%;
          color: rgba(0, 0, 0, 0.65);
          font-size: 14px;
          padding-left: 20px;
          padding-right: 27px;
        }
      }
    }

    /* 高亮 */

    .router-link-exact-active.router-link-active {
      color: @color;
      border-bottom: 2px solid @color;
    }
  }
</style>
